<template>
    <q-page class="chat-list-page">
        <ChatPage v-if="tab === 'conversation'"/>
        <AlertPage v-if="tab === 'alert'" />

        <q-page-sticky expand position="top">
            <q-toolbar class="text-white justify-around" :style="setTransColor()" :class="isAndroid15Plus? 'extra-top':''">
                <q-tabs v-model="tab">
                    <q-tab name="alert" label="通知" />
                    <q-tab name="conversation" label="私信" />
                </q-tabs>
            </q-toolbar>
        </q-page-sticky>
    </q-page>
</template>

<script setup>
import { ref } from 'vue'
import ChatPage from '../ChatPage.vue'
import AlertPage from '../AlertPage.vue'
import { setTransColor,isAndroid15Plus } from 'src/utils/common'

const tab = ref('alert')

</script>

<style lang="css" scoped>
.chat-list-page{
    padding-top:26px;
}
</style>